﻿import { Directive, ElementRef, Input, Renderer } from '@angular/core';
declare var $;
@Directive({
    selector: '[myRating]'
})

export class MyRatingDirective {
    private _isReadOnly: boolean;
    @Input('myRating') score: string;
    @Input() set IsReadOnly(isReadOnly: boolean) {
        this._isReadOnly = isReadOnly;
    }
    constructor(private el: ElementRef, renderer: Renderer) {
    }

    ngOnChanges() {
        $(this.el.nativeElement).raty({
            score: this.score,
            halfShow: false,
            readOnly: this._isReadOnly,
            noRatedMsg: "Not rated yet!",
            starHalf: "../Content/images/raty/star-half.png",
            starOff: "../Content/images/raty/star-off.png",
            starOn: "../Content/images/raty/star-on.png",
            hints: ["Poor", "Average", "Good", "Very Good", "Excellent"],
            click: function (score, event) {
                //Set the model value
            }
        });
    }
}
